@use "scss/colors";
@use "scss/variables";

.textContainer {
  margin: variables.$spacing-xs 0 0;
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  line-height: 20px;
  max-height: 250px;

  &.expanded {
    white-space: unset;
    overflow: auto;
  }
}

.text {
  display: inline-block;
  padding: 0 variables.$spacing-sm;
  background: colors.$grey-50;
  border: variables.$border-thin solid colors.$grey-100;
  border-radius: variables.$border-radius-xs;
  margin-right: variables.$spacing-md;
  margin-bottom: variables.$spacing-sm;
  white-space: nowrap;
  color: colors.$grey-400;
}

.expandBtn.expandBtn {
  height: 20px; // non-standard button size
}
